<template>
  <!-- 首次登录 -->
  <div class="first-login column-center" v-if="roleType=='parent'">
    <p style="font-weight:600;margin-top:112px;">已有学员家长请绑定学员信息</p>
    <van-button style="width:226px;margin-top:100px;" color="#FF9900" @click="toBindStuds">前往绑定</van-button>
    <van-button style="margin-top:23px;width:226px;" color="#FF9900" plain @click="toIndex">非家长，跳过</van-button>
  </div>
  <div class="first-login column-center" v-else>
    <p style="font-weight:600;margin-top:112px;">请选择登录校区</p>
    <van-button
      v-for="(item,index) in campusList"
      :key="index"
      style="width:226px;margin-top:30px;"
      color="#59BDC3"
      @click="selectCampus(item)"
      :plain="item.campusID != campusID"
      :disabled="item.campusID == campusID"
    >{{item.campusName}}</van-button>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import { Toast } from "vant";
import { TgetCampusMsg } from "@/api/personal";
export default {
  data() {
    return {};
  },
  methods: {
    toIndex() {
      this.$router.push("/home");
    },
    toBindStuds() {
      this.$router.push("/bindStuds");
    },
    // 选择校区
    selectCampus(value) {
      //保存选中校区id
      this.$store.commit("setCampusID", value.campusID);
      this.$store.commit("setTeacherName", value.userName);
      this.$router.push("/workBench");
    }
  },
  async created() {
    console.log(this.roleType);
    if (this.roleType == "teacher") {
      Toast.loading({ forbidClick: true, duration: 0 });
      const result = await TgetCampusMsg({
        phoneNumber: this.phone
      });
      console.log(result);
      
      if (result.result == "OK" && result.data != 0) {
        this.$store.commit("setCampusList", result.data);
        Toast.clear();
      } else {
        Toast.fail("获取校区失败!");
      }
    }
  },
  computed: {
    ...mapGetters({
      roleType: "getRoleType",
      campusList: "getCampusList",
      campusID: "getCampusID",
      phone: "getPhone"
    })
  }
};
</script>

<style lang="scss" scoped>
.first-login {
  // position: absolute;
  width: 100%;
  // height: 100%;
  font-family: PingFangSC-bold;
}
</style>